<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>认证中心</title>
    <link rel="stylesheet" href="${ctx}/layui/css/layui.css" media="all" />
</head>
<body layadmin-themealias="default">
<div class="layui-layout-head">
    <p>
        <img src="${ctx}/qbdmsStatic/images/hedlogo.png" alt="">
    </p>
</div>
<div class="layui-layout-body">
    <div class="layadmin-user-login-box layui-form">
        <input type="hidden" name="serviceUrl" value="${serviceUrl}">
        <input type="hidden" name="tips" value="${msg}">
        <input type="hidden" id="userId" name="userId" value="">
        <!--<div>-->
        <!--</div>-->
        <div class="layadmin-user-login-mess" >
            <p>用户登录</p>
            <input type="text" id="account" name="account" class="layui-input" lay-verify="required"
                   placeholder="用户名" autocomplete="off" value=""/>
            <div class="kit-login-col"></div>
            <input type="password" value="" id="password" name="password" lay-verify="required" placeholder="密码"
                   autocomplete="off" class="layui-input"/>
            <div class="layui-form-item validCode" <#if !useValidCode >style="display:none"</#if>>
        <!--<label class="layadmin-user-login-icon layui-icon layui-icon-vercode"></label>-->
        <input type="input" style="width: 185px;float: left;margin: 20px 20px 0 0;" id="validCode" name="validCode"
               lay-verify="<#if useValidCode >required</#if>" placeholder="验证码" autocomplete="off" class="layui-input"/>
        <img src="${ctx}/valid/getCode" style="margin-top:24px;" onclick="getValidCode(this);"/>
        <div class="kit-login-col"></div>
    </div>
    <div class="kit-login-col"></div>
    <button class="layui-btn layui-btn-normal"  lay-submit="submit" lay-filter="login_hash" id="login_hash" <#if useValidCode >style="margin-top:0"</#if>>马上登录</button>
<!--                    <div class="layadmin-user-forgetPass">-->
<!--                        <a href="" id="forget">忘记密码？</a>-->
<!--                        <a href="" class="forgetPassBtn-right" id="logup">立即注册</a>-->
<!--                    </div>-->
</div>


<input type="hidden" id="useValidCode" name="useValidCode" value="false" />
<div class="kit-login-row"><span style="color: firebrick">${msg}</span>
</div>


<!--</div>-->

</div>

<div style="" id="UserNameKeywords" style="display: none;">
    <form class="layui-form" action="">
        <div >
            <div >
                <ul id="listTest"></ul>
            </div>
        </div>
        <div class="layui-form-item" style="display:none">
            <label class="layui-form-label">用户ID:</label>
            <div class="layui-input-block">
                <input type="text" name="title" required  lay-verify="required" autocomplete="off" class="layui-input" id="test1">
            </div>
        </div>
        <div class="layui-form-item" style="display:none">
            <label class="layui-form-label">用户权重:</label>
            <div class="layui-input-block">
                <input type="text" name="title" required  lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
    </form>
</div>

<script src="${ctx}/layui/layui.js"></script>

<script>
    function getValidCode(obj) {
        obj.src = "${ctx}/valid/getCode?" + Math.random();
    }
    layui.use(['form'], function(){
        var $ = layui.$
            ,setter = layui.setter
            ,admin = layui.admin
            ,form = layui.form
            ,layer = layui.layer
        $(function() {
            if (window != top) {
                top.layer.alert("登录超时，请重新登录！", {
                    skin: 'layui-layer-lan'
                    ,closeBtn: 0
                    ,shift: 2
                },function () {
                    top.location.href = location.href;
                });
            }
        });
        form.render();
        //提交
        form.on('submit(login_hash)', function(obj){
            ajaxSubmit(obj.field)
        });
        $('body').keydown(function () {
            if(event.keyCode == '13'){
                $("#login_hash").click();
                // var data={};
                // data.password=$("#password").val();
                // data.account=$("#account").val();
                // data.validCode=$("#validCode").val();
                // ajaxSubmit(data);
            }
        });

        /* 获取弹出层事件 */
        function UserNameKeywords(keywords){
            layer.open({
                type: 1,
                title : '当前用户信息',
                area: ['450px', '400px'],
                offset : '16px',
                shadeClose : true, // 点击遮罩关闭
                btn : ['取消'],
                content:$('#UserNameKeywords')
            });
            $("#listTest").text("");
            for(var i=0;i<keywords.length;i++){
                var orgPathName = keywords[i].orgPathName;
                orgPathName = orgPathName.replace("租户管理/", "");
                $("#listTest").append("<li onclick='selectedUser(\" "+keywords[i].userId+" \")' style='margin-bottom: 11px;font-size: 17px;margin-bottom: 21px;padding-bottom: 3px;border-bottom: 1px solid #E3E0E0;'>"+orgPathName+"/"+keywords[i].fullName+"</li>")
            }
        }

        selectedUser = function(userId){
            document.getElementById("userId").value = userId;
            document.getElementById("login_hash").click();
        }

        function ajaxSubmit(data) {
            $.ajax({
                url: "${ctx}/loginExecute"
                ,data: data
                ,type:'post'
                ,dataType:'json'
                ,success:function(res){
                    if(res.code == 0){
                        //登入成功的提示与跳转
                        window.location.href = "${ctx}/index"
                    }else if(res.code == 2){
                        //选择用户登录
                        UserNameKeywords(res.data);
                    }
                    else{
                        if(res.data?res.data.useValidCode:false){
                            $(".validCode").attr("style", "display:block");
                            $(".validCode input").attr("lay-verify","required");
                            $("#useValidCode").val(true)
                        }
                        $(".validCode img").click();
                        layer.msg(res.msg);
                    }
                }
            });
        }
    });
</script>
</body>

</html>
<style>
    body,html{height: 100%;width: 100%}
    body{
        padding-top: 56px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }
    .layui-layout-body{
        background: url('${ctx}/qbdmsStatic/images/login2.png') no-repeat 0 0;
        background-size: 100% 100%;
        height: 100%;
        width: 100%;
    }
    .layui-layout-head{
        position: fixed;
        top:0;
        width: 100%;
        background: #2468F2;
        font-size:20px;
        font-weight:400;
        color:rgba(255,255,255,1);
    }
    .layui-layout-head p{
        width: 1000px;
        height: 56px;
        line-height: 56px;
        margin: auto;
    }
    .layui-layout-head p img{
        height: 70%;
        margin-right: 16px;
    }
    .layadmin-user-login-box{
        width: 1022px;
        height: 541px;
        position: absolute;
        top:50%;
        left:50%;
        margin: -270.5px 0 0 -511px;
        background: url('${ctx}/qbdmsStatic/images/login(2).png') no-repeat 0 0;
        padding: 18px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }
    .layadmin-user-login-mess{
        float: right;
        width: 420px;
        padding: 64px 60px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }
    .layadmin-user-login-mess #account{
        margin-bottom: 20px;
    }
    .layadmin-user-login-mess p{
        font-size:24px;
        font-family:Microsoft YaHei;
        font-weight:400;
        color:rgba(51,51,51,1);
        line-height:40px;
        margin-bottom: 32px;
    }
    .layadmin-user-login-mess #login_hash{
        width: 100%;
        height:40px;
        margin-top: 64px;
        background:rgba(36,104,242,1);
        box-shadow:0px 0px 10px 0px rgba(36,104,242,0.3);
        border-radius:20px;
    }
    .layadmin-user-forgetPass{
        opacity: 0.5;
        margin-top: 70px;
    }
    .layadmin-user-forgetPass a{
        color: #2468F2;
        font-size: 14px;
        text-decoration: none;
    }
    .forgetPassBtn-right{
        float: right;
    }
</style>
